<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Registration Page</title>
<script type="text/javascript" src="js/common/jquery.js"></script>

<script type="text/javascript">
	function showDiv(obj)
	{
		var val=obj.value;
		if(val=="c")
		{
			document.getElementById("companyDiv").style.display="block";
			document.getElementById("houseDiv").style.display="none";
		}
		if(val=="I")
		{
			document.getElementById("companyDiv").style.display="none";
			document.getElementById("houseDiv").style.display="block";
		}
	}
	
	function chkPass()
	{
		var pass=document.getElementById("pass").value;
		var cPass=document.getElementById("cPass").value;

		if(pass!=cPass)
		{
			alert("Passwords do not match.");
			document.getElementById("pass").value="";
			document.getElementById("cPass").value="";
		}
	}




</script>
</head>
<body onload="showDiv();">
<form:form action="saveUser.action" method="post" commandName="user">


	<table cellpadding="0" cellspacing="0" width="100%">
		<tbody>
		
		<tr>
			<td width="33%" class="label"> <spring:message code="userReg.title" /> </td>
			<td width="67%">
				<form:radiobutton path="title" value="Mr" label="Mr." />
				<form:radiobutton path="title" value="Mrs" label="Mrs." />
				<form:radiobutton path="title" value="Ms" label="Ms." />
			</td>
		</tr>
		<tr>
			<td class="label">First Name</td>
			<td>: <form:input path="fname" /></td>
		</tr>
		<tr>
			<td class="label">Middle Name</td>
			<td>: <form:input path="mname" /></td>
		</tr>
		<tr>
			<td class="label">Last Name</td>
			<td>: <form:input path="lname" /></td>
		</tr>
		<tr>
			<td class="label">Password</td>
			<td>: <form:password path="password" /></td>
		</tr>
		<tr>
			<td class="label">Confirm Password</td>
			<td>: <input name="cPass" type="password" onblur="chkPass()">
		</td></tr>
		<tr>
			<td class="label">Register As</td>
			<td>
			
				<form:radiobutton cssClass="registerAs" path="registerAs" value="C" label="Company" onclick="showDiv();"/>
				<form:radiobutton cssClass="registerAs" path="registerAs" value="I" label="Individual"  onclick="showDiv();"/>
			</td>
		</tr>
        
      <tr>
        	<td colspan="2">
            	<div id="companyDiv" style="display:none">
                	<table cellpadding="0" cellspacing="0" width="100%">
                    <tbody><tr>
                        <td width="33%" class="label">Your Designation</td>
                        <td width="67%">: <form:input path="contact.designation" /></td> 
                    </tr>
                    <tr>
                        <td class="label">Company Name</td>
                        <td>: <form:input path="contact.companyName" /></td>
                    </tr>
                    <tr>
                        <td class="label">Address Line 1</td>
                        <td>: <form:input path="contact.cmpaddress1" /></td>
                    </tr>
                    <tr>
                        <td class="label">Address Line 2</td>
                        <td>: <form:input path="contact.cmpaddress2" /></td>
                    </tr>
                    </tbody></table>
                </div>
            </td>
        </tr>
        
        <tr>
			<td class="label">State</td>
			<td>: 
				<form:select path="contact.stateId" onchange="">
					<form:options items="${states}" itemValue="id" itemLabel="name" />
				</form:select>
			</td>
		</tr>
		
		<tr>
			<td class="label">City</td>
			<td>: 
				<form:select path="contact.city">
					<form:option value="0" label="Select City" />
				</form:select>
			</td>
			<c:out value="${city}"></c:out>
		</tr>
		
		
		<tr>
			<td class="label">Zip Code</td>
			<td>: <form:input path="contact.zip" maxlength="6"/></td>
		</tr><tr>
			<td class="label">Mobile Number</td>
			<td>: <form:input path="contact.phoneMobile" maxlength="10"/></td>
		</tr>
		<tr>
			<td class="label">Landline Number</td>
			<td>: <form:input path="contact.phoneLandline" maxlength="10"/></td>
		</tr>
		<tr>
			<td class="label">E-Mail:</td>
			<td>: <form:input path="contact.emailId"/></td>
		</tr>
        
        <tr>
        	<td colspan="2">
            <div id="houseDiv">
            	<table border="0" cellpadding="0" cellspacing="0" width="100%">
                <tbody><tr>
                    <td width="33%" class="label">House/Plot No.</td>
                    <td width="67%">: <form:input path="contact.house"/></td>
                </tr>
                <tr>
                    <td class="label">Local Area</td>
                    <td>: <form:input path="contact.localarea"/></td>
                </tr>                	
                </tbody></table>
            </div>
            </td>
        </tr>
		
		<tr>
			<td align="left" class="label">Date of Birth</td>
			<td>: 
				<form:input path="dob" cssClass="datepicker"/>
			</td>
		</tr>
		<tr>
			<td class="label">Anniversary</td>
			<td>: 
				<form:input path="anniversary" cssClass="datepicker"/>
			</td>
		</tr>
		<tr>
			<td class="label">No. of members in your family</td>
			<td>: <form:input path="noofkids"/></td>
		</tr>
		<tr>
			<td width="150" class="label">Which is your favorite Pizza &amp; Why?</td>
			<td>: 
				<form:select path="pizzaTypeLike">
					<form:option label="Pizza1" value="1"></form:option>
				</form:select>
			</td>
		</tr>
		<tr>
			<td class="label">Reasons</td>
			<td valign="top">: <form:textarea path="reasonForLikePizza" cols="20" rows="4"/></td>
		</tr>
   		<tr>
       </tr>
		<tr>
			<td colspan="2"><input type="submit" value="Register"></td>
		</tr>
</tbody>
</table>
</form:form>	
</body>
</html>